<template>
	<view class="container">
		<view class="touzhi">
			<view class="touzhi1">
				<text>{{$t('kuan.licaitouzhijine')}}</text>
			</view>
			<view class="touzhiinput">
				<input style="width: 80%;" type="number" v-model="money" maxlength="-1" @input="checkMinimum"
					:placeholder="this.$t('kuan.qingshuru')+'100<xxx<10000'" />
				<text>USDT</text>
			</view>
			<view class="dizhi">
				<text>{{$t('kuan.dizhi')}}:{{formatNumber(currentWalletAddress)}}</text>
			</view>
			<view class="rishouyi">
				<text>{{$t('kuan.rishouyi')}}:</text>
				<view class="wenhao" @click="open">
					<image class="wenhaoimg" src="/static/icon/wenhao.png" mode=""></image>
					<text>{{ acceleration }}%</text>
				</view>
			</view>
			<view class="rishouyi">
				<text>USDK{{$t('kuan.yuer')}}:{{userinfo.usdk||0}}</text>
				<view class="wenhao">
					<text>{{$t('kuan.xuxiaohao')}}:{{xiaohao}}usdk</text>
				</view>
			</view>

			<view class="touzhianniu" @click="touzhi">
				<text>{{$t('kuan.touzhi')}}</text>
			</view>
		</view>
		<!-- 弹框说明 -->
		<uni-popup ref="popup" type="center">
			<view class="shuomingwenan">
				<view class="guanbi">
					<image class="guanbi1" @click="close" src="/static/icon/guanbi.png" mode=""></image>
				</view>
				<view class="wenzhang">
					<text>100~499{{$t('kuan.jiasu')}}0.9%</text>
					<text>500~999{{$t('kuan.jiasu')}}1.0%</text>
					<text>1000~2999{{$t('kuan.jiasu')}}1.1%</text>
					<text>3000~4999{{$t('kuan.jiasu')}}1.3%</text>
					<text>5000~10000{{$t('kuan.jiasu')}}1.5%</text>
				</view>

			</view>
		</uni-popup>



		<!-- 投资订单 -->
		<view class="touzhi">
			<view class="touzhidingdan" @click="gojilu">
				<text class="touzhidingdan1">{{$t('kuan.touzhidingdan')}}</text>
				<text>{{$t('kuan.touzhijilu')}}></text>
			</view>
			<view class="touzhidingdan2">
				<view class="touzhizonger">
					<text class="touzhizonger1">{{touzi}} USDT</text>
					<!-- <text>{{$t('kuan.touzhizoner')}}</text> -->
				</view>
				<view class="touzhiimg">
					<image src="/static/icon/usdt.jpg" mode=""></image>
				</view>
			</view>
			<view class="leiji">
				<text>{{$t('kuan.leijishouyi')}}</text>
				<text>{{fenyong}} USDT</text>
			</view>

		</view>
		<!-- 以下是该组件使用的全部属性 -->
		<sanshui-payment-password v-model="showModal" :mode="1" :digits="6" @submit="submitHandle" />

	</view>
</template>

<script>
	//引入组件文件
	import SanshuiPaymentPassword from '../../components/sanshui-payment-password/sanshui-payment-password.vue'
	import web3WalletService from '@/api/web3.js'
	import {
		Debounce
	} from "@/api/debounce.js"; //防抖
	import walletMixin from "@/mixins/walletMixin.js"; // 钱包混入
	export default {
		mixins: [walletMixin],
		components: {
			SanshuiPaymentPassword
		},
		data() {
			return {
				money: '',
				xiaohao: '0',
				address: '',
				userinfo: {},
				touzi: '0',
				fenyong: '0',
				// 钱包相关数据
				paymentWalletAddress: '', // 收款钱包地址
				currentWalletAddress: '', // 当前连接的钱包地址
				walletConnected: false, // 钱包连接状态
				usdtBalance: '0.00', // USDT余额
				paymentStatus: 'pending', // 支付状态: pending, success, failed
				orderId: '', // 订单ID
				txHash: '', // 交易哈希
				checkTimer: null, // 定时器
				paymentAmount: '0', // 支付金额
				// 钱包地址变化回调引用
				walletAddressChangeCallback: null,
				showModal: false,
				zjc: "false",
				zfpass: "false"
			}
		},
		computed: {
			acceleration() {
				let acc = 0;
				if (this.money >= 100 && this.money <= 499) {
					acc = 0.9;
				} else if (this.money >= 500 && this.money <= 999) {
					acc = 1.0;
				} else if (this.money >= 1000 && this.money <= 2999) {
					acc = 1.1;
				} else if (this.money >= 3000 && this.money <= 4999) {
					acc = 1.3;
				} else if (this.money >= 5000 && this.money <= 10000) {
					acc = 1.5;
				} else {
					acc = 0; // 超过范围的设置为0（或者可以显示其他提示）
				}
				return acc;
			}
		},
		onLoad() {
			uni.setNavigationBarTitle({
				title: this.$t('licais'), // 必填，页面标题）
			})
			this.getuserinfo()
			this.getlicailist()
		},
		onShow() {
			// 页面显示时更新当前钱包地址
			this.updateCurrentWalletAddress();
			this.getuserinfo()
		},
		mounted() {
			// 设置i18n实例
			web3WalletService.setI18n(this.$i18n);
			// 尝试自动连接钱包
			this.autoConnectWallet();
			// 添加页面卸载监听器
			this.addPageUnloadListener();
			// 初始化当前钱包地址显示
			this.updateCurrentWalletAddress();
			// 添加钱包地址变化监听
			this.addWalletAddressListener();
		},
		beforeDestroy() {
			// 移除页面卸载监听器
			this.removePageUnloadListener();
			// 移除钱包地址监听器
			this.removeWalletAddressListener();
		},
		methods: {
			// 添加钱包地址变化监听
			addWalletAddressListener() {
				// 创建回调函数并保存引用
				this.walletAddressChangeCallback = (oldAccount, newAccount) => {
					console.log('licai页面收到钱包地址变化:', {
						oldAccount,
						newAccount
					});
					this.updateCurrentWalletAddress();
				};

				// 监听钱包地址变化
				web3WalletService.onAddressChange(this.walletAddressChangeCallback);
			},

			// 移除钱包地址监听器
			removeWalletAddressListener() {
				// 移除钱包地址变化监听
				if (this.walletAddressChangeCallback) {
					web3WalletService.offAddressChange(this.walletAddressChangeCallback);
					this.walletAddressChangeCallback = null;
				}
			},

			// 获取个人资料
			getuserinfo() {
				let data = {}
				let opts = {
					url: '/user/GetUserInfo',
					method: 'GET'
				};
				this.api.httpTokenRequest(opts, data).then(res => {
					// console.log('个人资料', res);
					if (res[1].data.state == 'success') {
						this.userinfo = res[1].data.list[0]
						this.zfpass = this.userinfo.zfpass
						this.zjc = this.userinfo.zjc

					}

				})
			},
			// 理财列表
			getlicailist() {
				let data = {
					yema: 1,
					yezhi: 10
				}
				let opts = {
					url: '/order/Getlicailist',
					method: 'GET'
				};
				this.api.httpTokenRequest(opts, data).then(res => {
					// console.log('理财', res);
					if (res[1].data.state == 'success') {
						this.touzi = res[1].data.touzi
						this.fenyong = res[1].data.fenyong

					}

				})
			},
			// 投资记录
			gojilu: Debounce(function() {
				this.$tab.navigateTo('/pages/kuan/touzhijilu')
			}, 1000),
			// 格式数字
			formatNumber(number) {
				// 处理 undefined 或 null 的情况
				if (!number) return '';
				// 将数字转化为字符串
				const str = number.toString();
				// 提取前四位和后四位，中间用省略号代替
				const start = str.slice(0, 5);
				const end = str.slice(-5);
				return `${start}......${end}`;
			},
			checkMinimum() {
				this.xiaohao = this.money * 0.3

			},
			payment(){
				if(this.zjc==="false"&&this.zfpass==="false"){
					this.$tab.redirectTo('/pages/my/zhujici')
				}else if(this.zjc==="true"&&this.zfpass==="false"){
					this.$tab.redirectTo('/pages/my/yanzengzhuci?type=1')
				}else if(this.zjc==="true"&&this.zfpass==="true"){
					this.showModal = true
				}
				
			},
			submitHandle(e) {
			  if(e.type=="true"){
				  this.touzhi()
			  }
			},
			// 投资金额 - 创建订单并支付
			touzhi: Debounce(async function() {
				try {
					// 验证输入金额
					if (!this.money || this.money < 100) {
						this.$modal.msg(this.$t('licai.payment.min_amount_error'));
						return;
					}
					if (this.money > 10000) {
						this.$modal.msg(this.$t('licai.payment.max_amount_error'));
						return;
					}
					// 确保钱包已连接
					if (!web3WalletService.isWalletConnected()) {
						console.log('钱包未连接，尝试连接...');
						this.$modal.msg(this.$t('wallet.payment.connecting_wallet'));
						const connectResult = await web3WalletService.connectBSC();
						if (!connectResult.success) {
							this.$modal.msg(this.$t('wallet.payment.connect_wallet_failed'));
							return;
						}
						this.walletConnected = true;
						console.log('钱包连接成功:', connectResult);
						// 加载USDT余额
						await this.loadUSDTBalance();
						// 更新当前钱包地址显示
						this.updateCurrentWalletAddress();
					} else {
						console.log('钱包已连接');
					}

					// 检查钱包地址与登录用户是否一致
					const currentAddress = web3WalletService.getCurrentAccount();
					const tokenAddress = this.getTokenUserAddress();

					if (currentAddress && tokenAddress && currentAddress.toLowerCase() !== tokenAddress
						.toLowerCase()) {
						console.log('钱包地址不匹配，当前地址:', currentAddress, 'token地址:', tokenAddress);
						this.$modal.msg(this.$t('wallet.payment.wallet_mismatch'));
						// 可以选择自动重新登录或提示用户手动操作
						await this.handleWalletMismatch();
						return;
					}

					// 获取钱包地址
					console.log('获取收款地址...');
					const walletResult = await this.getWalletAddress();
					if (!walletResult.success) {
						this.$modal.msg(this.$t('wallet.payment.get_address_failed'));
						return;
					}
					console.log('收款地址:', this.paymentWalletAddress);

					// 检查USDT余额
					console.log('检查USDT余额...');
					const balance = parseFloat(this.usdtBalance);
					const amounts = parseFloat(this.money);
					console.log('余额检查详情:', {
						balance,
						amounts,
						isBalanceValid: !isNaN(balance),
						isAmountValid: !isNaN(amounts)
					});

					if (isNaN(balance) || isNaN(amounts)) {
						console.error('余额或金额转换失败');
						this.$modal.msg(this.$t('wallet.payment.insufficient_balance'));
						return;
					}
					//console.log("")
					const amount = amounts * 0.7

					if (balance < (amount)) {
						console.log('余额不足，显示提示', amount);
						this.$modal.msg(this.$t('wallet.payment.insufficient_balance'));
						return;
					}
					console.log('余额检查通过，继续创建订单...');

					// 创建订单
					console.log('创建理财订单...');
					let data = {
						money: this.money
					}
					let opts = {
						url: '/order/Addlicaiorder',
						method: 'POST'
					};

					const orderRes = await this.api.httpTokenRequest(opts, data);
					console.log('创建订单结果:', orderRes);
					console.log('订单状态:', orderRes[1].data.state);
					console.log('订单消息:', orderRes[1].data.msg);

					// 检查订单创建是否成功
					if (orderRes[1].data.state === 'success') {
						this.orderId = orderRes[1].data.order;
						this.paymentAmount = orderRes[1].data.dazhemoney || this.money;
						console.log('订单创建成功，订单ID:', this.orderId);
						console.log('支付金额:', this.paymentAmount);

						// 直接进行支付
						await this.processPayment();
					} else {
						console.log('订单创建失败:', orderRes[1].data.msg);
						this.$modal.msg(orderRes[1].data.msg);
					}
				} catch (error) {
					console.error('创建订单失败:', error);
					this.$modal.msg(this.$t('wallet.payment.operation_failed'));
				}
			}, 1000),

			// 处理支付
			async processPayment() {
				try {
					console.log('开始USDT支付...');
					console.log('支付前检查 - 收款地址:', this.paymentWalletAddress);
					console.log('支付前检查 - USDT余额:', this.usdtBalance);
					console.log('支付前检查 - 支付金额:', this.paymentAmount);

					this.$modal.msg(this.$t('wallet.payment.payment_initiated'));
					const payResult = await this.payWithUSDT();
					console.log('支付结果:', payResult);

					if (payResult.success) {
						// 支付成功，通知后端
						await this.notifyPaymentSuccess();
						// 刷新理财列表
						this.getlicailist();
						this.$modal.msg(this.$t('wallet.payment.payment_success'));
					}
				} catch (error) {
					console.error('支付失败:', error);
					this.$modal.msg(this.$t('wallet.payment.operation_failed'));
				}
			},

			// 获取钱包地址（返回Promise）
			getWalletAddress() {
				return new Promise((resolve, reject) => {
					let opts = {
						url: '/xgt/GetmoneyDizhi',
						method: 'GET'
					};
					this.api.httpTokenRequest(opts, {}).then(res => {
						console.log('获取钱包地址', res);
						if (res[1].data.state == 'success' && res[1].data.list && res[1].data.list.length >
							0) {
							this.paymentWalletAddress = res[1].data.list[0].dizhi;
							resolve({
								success: true,
								address: this.paymentWalletAddress
							});
						} else {
							resolve({
								success: false,
								error: this.$t('wallet.payment.get_address_failed')
							});
						}
					}).catch(err => {
						console.error('获取钱包地址失败', err);
						resolve({
							success: false,
							error: this.$t('wallet.payment.get_address_failed')
						});
					});
				});
			},

			// 自动连接钱包
			async autoConnectWallet() {
				try {
					const result = await web3WalletService.autoConnect();
					if (result.success) {
						this.walletConnected = true;
						this.loadUSDTBalance();
						// 更新当前钱包地址显示
						this.updateCurrentWalletAddress();
					}
				} catch (error) {
					console.log('自动连接钱包失败:', error);
				}
			},

			// 加载USDT余额
			async loadUSDTBalance() {
				try {
					console.log('开始加载USDT余额...');
					const balance = await web3WalletService.getUSDTBalance();
					console.log('获取到的USDT余额:', balance);
					this.usdtBalance = balance;
					console.log('设置后的usdtBalance:', this.usdtBalance);
				} catch (error) {
					console.error('获取USDT余额失败:', error);
					this.usdtBalance = '0.00';
				}
			},

			// 格式化地址显示
			formatAddress(address) {
				return web3WalletService.formatAddress(address);
			},

			// USDT支付
			async payWithUSDT() {
				console.log('开始USDT支付流程...');

				// 再次确认钱包连接状态
				if (!web3WalletService.isWalletConnected()) {
					console.log('钱包连接检查失败');
					this.$modal.msg(this.$t('wallet.payment.wallet_disconnected'));
					return {
						success: false,
						error: this.$t('wallet.payment.wallet_disconnected')
					};
				}
				console.log('钱包连接状态正常');

				if (!this.paymentWalletAddress) {
					console.log('收款地址为空');
					this.$modal.msg(this.$t('wallet.payment.wallet_address_missing'));
					return {
						success: false,
						error: this.$t('wallet.payment.wallet_address_missing')
					};
				}
				console.log('收款地址:', this.paymentWalletAddress);

				// 检查余额
				const balance = parseFloat(this.usdtBalance);
				const amounts = parseFloat(this.paymentAmount);
				console.log('payWithUSDT - 余额检查详情:');
				console.log('原始usdtBalance:', this.usdtBalance, '类型:', typeof this.usdtBalance);
				console.log('转换后余额:', balance, '类型:', typeof balance);
				console.log('转换后金额:', amounts, '类型:', typeof amounts);
				console.log('余额比较详情:', {
					balance,
					amounts,
					isBalanceValid: !isNaN(balance),
					isAmountValid: !isNaN(amounts)
				});

				if (isNaN(balance) || isNaN(amounts)) {
					console.error('payWithUSDT - 余额或金额转换失败');
					this.$modal.msg(this.$t('wallet.payment.insufficient_balance'));
					return {
						success: false,
						error: this.$t('wallet.payment.insufficient_balance')
					};
				}
				//const amount = amounts * 0.7
				//console.log("ddddddddddddddddddd",amounts)
				if (balance < amounts) {
					console.log('payWithUSDT - 余额不足，显示提示');
					this.$modal.msg(this.$t('wallet.payment.insufficient_balance'));
					return {
						success: false,
						error: this.$t('wallet.payment.insufficient_balance')
					};
				}

				try {
					console.log('调用web3WalletService.transferUSDT...');
					this.$modal.msg(this.$t('wallet.payment.payment_initiated'));

					// 调用USDT转账
					const result = await web3WalletService.transferUSDT(this.paymentWalletAddress, amounts);
					console.log('transferUSDT返回结果:', result);

					if (result.success) {
						this.txHash = result.txHash;
						this.paymentStatus = 'pending';
						this.$modal.msg(this.$t('wallet.payment.transaction_sent'));
						console.log('交易哈希:', this.txHash);

						// 立即通知后端交易已发送
						await this.notifyPaymentPending();

						// 显示成功消息，不等待确认
						this.$modal.msg(this.$t('wallet.payment.transaction_sent'));

						// 可选：后台等待交易确认（不影响用户体验）
						this.waitForTransactionConfirmBackground();

						return {
							success: true,
							txHash: this.txHash
						};
					} else {
						this.paymentStatus = 'failed';
						console.log('支付失败:', result.error);
						this.$modal.msg(result.error || this.$t('wallet.payment.payment_failed'));
						return {
							success: false,
							error: result.error || this.$t('wallet.payment.payment_failed')
						};
					}
				} catch (error) {
					console.error('支付失败:', error);
					this.paymentStatus = 'failed';
					this.$modal.msg(this.$t('wallet.payment.payment_failed') + ': ' + error.message);
					return {
						success: false,
						error: this.$t('wallet.payment.payment_failed') + ': ' + error.message
					};
				}
			},

			// 等待交易确认（后台）
			async waitForTransactionConfirmBackground() {
				// 后台确认，不影响用户体验
				setTimeout(async () => {
					try {
						let checkCount = 0;
						const maxChecks = 20; // 最多检查20次（60秒）

						const checkInterval = setInterval(async () => {
							try {
								checkCount++;
								const status = await web3WalletService.checkTransactionStatus(
									this.txHash);

								if (status === 'success') {
									clearInterval(checkInterval);
									this.paymentStatus = 'success';
									// 通知后端交易确认成功
									await this.notifyPaymentSuccess();
									console.log('交易确认成功');
								} else if (status === 'failed') {
									clearInterval(checkInterval);
									this.paymentStatus = 'failed';
									console.log('交易确认失败');
								} else if (checkCount >= maxChecks) {
									clearInterval(checkInterval);
									this.paymentStatus = 'timeout';
									console.log('交易确认超时');
								}
								// pending状态继续等待
							} catch (error) {
								console.error('检查交易状态失败:', error);
								if (checkCount >= maxChecks) {
									clearInterval(checkInterval);
								}
							}
						}, 3000); // 每3秒检查一次
					} catch (error) {
						console.error('后台交易确认失败:', error);
					}
				}, 1000); // 延迟1秒开始检查
			},

			// 通知后端支付待处理（交易已发送）
			async notifyPaymentPending() {
				if (!this.orderId || !this.txHash) return;

				let data = {
					orderId: this.orderId,
					txHash: this.txHash,
					amount: this.paymentAmount,
					status: 'pending'
				};
				let opts = {
					url: '/order/NotifyPayment',
					method: 'POST'
				};

				try {
					const res = await this.api.httpTokenRequest(opts, data);
					console.log('通知交易已发送:', res);
				} catch (err) {
					console.error('通知交易发送失败:', err);
				}
			},

			// 通知后端支付成功
			async notifyPaymentSuccess() {
				if (!this.orderId || !this.txHash) return;

				let data = {
					orderId: this.orderId,
					txHash: this.txHash,
					amount: this.paymentAmount,
					status: 'success'
				};
				let opts = {
					url: '/order/NotifyPayment',
					method: 'POST'
				};

				try {
					const res = await this.api.httpTokenRequest(opts, data);
					console.log('通知支付成功:', res);
				} catch (err) {
					console.error('通知支付成功失败:', err);
				}
			},

			// 打开弹框
			open() {
				this.$refs.popup.open('center')
			},
			// 关闭弹框
			close() {
				this.$refs.popup.close()
			},

			// 添加页面卸载监听器
			addPageUnloadListener() {
				// 监听页面卸载事件
				window.addEventListener('beforeunload', this.handlePageUnload);
				window.addEventListener('unload', this.handlePageUnload);

				// 监听移动端应用切换到后台
				document.addEventListener('visibilitychange', this.handleVisibilityChange);
			},

			// 移除页面卸载监听器
			removePageUnloadListener() {
				window.removeEventListener('beforeunload', this.handlePageUnload);
				window.removeEventListener('unload', this.handlePageUnload);
				document.removeEventListener('visibilitychange', this.handleVisibilityChange);
			},

			// 处理页面卸载
			handlePageUnload() {
				// 如果有待确认的交易，立即通知后端
				if (this.txHash && this.paymentStatus === 'pending') {
					this.notifyPaymentPending();
				}
			},

			// 处理可见性变化
			handleVisibilityChange() {
				if (document.hidden && this.txHash && this.paymentStatus === 'pending') {
					// 页面隐藏时，如果有待确认的交易，通知后端
					this.notifyPaymentPending();
				}
			},

			// 获取token对应的用户地址
			getTokenUserAddress() {
				try {
					const userInfo = uni.getStorageSync('userinfo');
					if (userInfo && userInfo.dizhi) {
						return userInfo.dizhi;
					}
					return null;
				} catch (error) {
					console.error('获取token用户地址失败:', error);
					return null;
				}
			},

			// 处理钱包地址不匹配
			async handleWalletMismatch() {
				try {
					const currentAddress = web3WalletService.getCurrentAccount();

					// 提示用户当前钱包地址与登录账户不匹配
					const confirmResult = await this.$modal.confirm({
						title: this.$t('wallet.payment.wallet_mismatch_title'),
						content: this.$t('wallet.payment.wallet_mismatch_content', {
							current: this.formatAddress(currentAddress),
							logged: this.formatAddress(this.getTokenUserAddress())
						}),
						confirmText: this.$t('wallet.payment.relogin'),
						cancelText: this.$t('wallet.payment.cancel')
					});

					if (confirmResult) {
						// 用户选择重新登录
						await this.reloginWithCurrentWallet();
					}
				} catch (error) {
					console.error('处理钱包地址不匹配失败:', error);
					this.$modal.msg(this.$t('wallet.payment.wallet_mismatch_error'));
				}
			},

			// 更新当前钱包地址显示
			updateCurrentWalletAddress() {
				try {
					const currentAddress = web3WalletService.getCurrentAccount();
					if (currentAddress) {
						this.currentWalletAddress = currentAddress;
						console.log('更新当前钱包地址:', this.currentWalletAddress);
					} else {
						this.currentWalletAddress = '';
						console.log('当前无连接的钱包地址');
					}
				} catch (error) {
					console.error('更新当前钱包地址失败:', error);
					this.currentWalletAddress = '';
				}
			},

			// 使用当前钱包重新登录
			async reloginWithCurrentWallet() {
				try {
					const currentAddress = web3WalletService.getCurrentAccount();
					if (!currentAddress) {
						this.$modal.msg(this.$t('wallet.payment.get_current_address_failed'));
						return;
					}

					this.$modal.msg(this.$t('wallet.payment.relogin_progress'));

					// 使用当前钱包地址重新登录
					const loginResult = await this.api.httpRequest({
						url: '/user/Userlogin',
						method: 'POST'
					}, {
						dizhi: currentAddress,
						yqm: '' // 可以根据需要添加邀请码
					});

					if (loginResult[1].data.state === 'success') {
						// 更新token
						uni.setStorageSync("token", JSON.stringify(loginResult[1].data.token));

						// 获取新的用户信息
						await this.api.httpTokenRequest({
							url: '/user/GetUserInfo',
							method: 'GET'
						}, {}).then(res => {
							if (res[1].data.state === 'success') {
								uni.setStorageSync('userinfo', res[1].data.list[0]);
							}
						});

						this.$modal.msg(this.$t('wallet.payment.relogin_success'));

						// 重新执行支付流程
						setTimeout(() => {
							this.touzhi();
						}, 1000);
					} else {
						this.$modal.msg(loginResult[1].data.msg || this.$t('wallet.payment.relogin_failed'));
					}
				} catch (error) {
					console.error('重新登录失败:', error);
					this.$modal.msg(this.$t('wallet.payment.relogin_failed'));
				}
			}
		},
	}
</script>

<style>
	.container {
		width: 100%;
		display: flex;
		flex-direction: column;
		align-items: center;
		justify-content: center;
	}

	.touzhi {
		width: 86%;
		padding: 25rpx;
		display: flex;
		flex-direction: column;
		align-items: center;
		justify-content: center;
		border-radius: 20rpx;
		background-color: #272727;
		border: 1rpx solid #4b91e6;
		margin-top: 20rpx;
	}

	.touzhi1 {
		width: 100%;
		margin-top: 10rpx;
		font-size: 36rpx;
		font-weight: 700;
	}

	.touzhiinput {
		width: 92%;
		padding: 20rpx;
		border-radius: 30rpx;
		margin-top: 30rpx;
		background-color: #000;
		border: 1rpx solid #e6e6e6;
		display: flex;
		flex-direction: row;
		align-items: center;
		justify-content: space-between;
	}

	.dizhi {
		width: 100%;
		font-size: 28rpx;
		margin-top: 30rpx;
		font-weight: 500;
	}

	.rishouyi {
		width: 100%;
		display: flex;
		flex-direction: row;
		align-items: center;
		justify-content: space-between;
		margin-top: 30rpx;
	}

	.wenhao {
		display: flex;
		flex-direction: row;
		align-items: center;
	}

	.wenhaoimg {
		width: 40rpx;
		height: 40rpx;
		margin-right: 10rpx;
	}

	.touzhianniu {
		width: 90%;
		height: 80rpx;
		background-color: #4858b3;
		border-radius: 30rpx;
		margin-top: 30rpx;
		display: flex;
		align-items: center;
		justify-content: center;

	}

	.touzhidingdan {
		width: 100%;
		display: flex;
		flex-direction: row;
		align-items: center;
		justify-content: space-between;
		margin-top: 15rpx;

	}

	.touzhidingdan1 {
		font-size: 36rpx;
		font-weight: 700;
	}

	.touzhidingdan2 {
		width: 94%;
		padding: 20rpx;
		height: 140rpx;
		display: flex;
		flex-direction: row;
		align-items: center;
		justify-content: space-between;
		background-color: #000;
		background-image: linear-gradient(to right, #272727 10%, #709ad1 90%);
		border-radius: 20rpx;
		margin-top: 30rpx;
	}

	.touzhizonger {
		display: flex;
		flex-direction: column;
		margin-left: 15rpx;
		font-size: 28rpx;
		font-weight: 500;
	}

	.touzhizonger1 {
		font-size: 42rpx;
		font-weight: 700;
		margin-bottom: 15rpx;
	}

	.touzhiimg {
		width: 110rpx;
		height: 110rpx;
		border-radius: 50%;
		overflow: hidden;
		margin-right: 30rpx;
	}

	.leiji {
		width: 100%;
		display: flex;
		flex-direction: row;
		align-items: center;
		justify-content: space-between;
		margin-top: 20rpx;
	}

	/* 弹框说明 */
	.shuomingwenan {
		width: 460rpx;
		background-color: #333333;
		border-radius: 20rpx;
		display: flex;
		flex-direction: column;
		align-items: center;
		justify-content: center;
		padding: 25rpx;
	}

	.guanbi {
		width: 100%;
		display: flex;
		justify-content: end;
	}

	.guanbi1 {
		width: 50rpx;
		height: 50rpx;
	}

	.wenzhang {
		width: 70%;
		display: flex;
		flex-direction: column;
		margin-top: 25rpx;
		margin-bottom: 25rpx;
		line-height: 36rpx;
		font-size: 28rpx;
		font-weight: 500;
	}
</style>